<template>
    <div class="common-layout">
        <el-container>
            <el-header class="header" style="padding: 0">
                <el-menu
                    class="el-menu-demo"
                    @select="handleSelect"
                    :default-active="proxy.router.currentRoute.value.path"
                    :ellipsis="false"
                    mode="horizontal"
                    router
                    background-color="#545c64"
                    text-color="#fff"
                    active-text-color="#ffd04b"
                    style="display: flex; justify-content: space-between; align-items: center;"
                >
                    <el-menu-item index="home">
                        <template #title>
                            <span>论坛管理系统</span>
                        </template>
                    </el-menu-item>
                    <el-sub-menu index="">
                        <template #title>{{ userInfo.name }}</template>
                        <el-menu-item index="/profile">个人中心</el-menu-item>
                        <el-menu-item index="logout">退出登录</el-menu-item>
                    </el-sub-menu>
                </el-menu>
            </el-header>
            <el-container>
                <el-aside width="200px" height="100vh">
                    <el-menu
                        :default-active="proxy.router.currentRoute.value.path"
                        class="el-menu-vertical-demo"
                        router
                    >
                        <el-menu-item index="/myForum">我的发布</el-menu-item>
                        <el-menu-item index="/myCollection">我的收藏</el-menu-item>
                        <el-menu-item index="/publish">帖子发布</el-menu-item>
                    </el-menu>
                </el-aside>
                <el-main>
                    <router-view></router-view>
                </el-main>
            </el-container>
        </el-container>
    </div>
</template>
  

<script setup>
import { getCurrentInstance, ref } from 'vue';

const { proxy } = getCurrentInstance()
const userInfo = {
    name: '',
    account: ''
}
const defaultActive = ref('home')

const init = () => {
    let loginUser = proxy.cookies.get('bbs-web')
    // let loginUser = JSON.parse(proxy.cookies.get("bbs-web"))
    
    // userInfo.name = loginUser.name
    // userInfo.account = loginUser.account

    // let da = proxy.router.currentRoute.value.path
    // if(da) {
    //     defaultActive.value = da
    // }
    // let loginUser = JSON.parse(sessionStorage.getItem("bbs-web"))

	userInfo.name = loginUser.name
	userInfo.account = loginUser.account
}

init()

const handleSelect = (key, keyPath) => {
    if(key == 'logout') {
        // proxy.cookies.remove('bbs-web')
        sessionStorage.removeItem('bbs-web')
        proxy.router.push('/login') // router已经全局挂载
    }
}
</script>

<style lang="scss" scoped>

</style>